<template>
  <div class="vertify-frameset flex">
    <div class="container flex">
      <slot name="main" />
    </div>

    <div class="tip" v-show="tipShow">
      <div class="title">Note</div>
      <slot name="tipContent" />
    </div>
  </div>
</template>

<script>
export default {
  name: 'VertifyFrameSet',
  props: ['tipShow'],
  methods: {
    //直接确定是否注册 回车
    //除最后一个input框 当不与其它input框同时使用时 enter 回车就是触发事件
    windowKeyUp(e) {
      const focusElemnet = document.activeElement
      const inputs = document.getElementsByTagName('input')
      const inputsArr = Array.from(inputs)
      inputsArr.pop()
      const flag =inputsArr.findIndex((input)=>{
        return input === focusElemnet
      }) === -1
      if(flag && e.keyCode === 13) {//按钮submit
        this.$emit('submit')
      }else {
        // console.log('不允许')
      }
    }
  },
  mounted() {
    window.addEventListener('keyup', this.windowKeyUp.bind(this))
    //卸载
    this.$once('hook:beforeDestory', function() {
      window.removeEventListener('scroll', this.windowKeyUp)
    })
  }
}
</script>

<style lang="less">
  @import url('./vertify_frame_set.less');
</style>